<ion-header>
  <ion-toolbar class="toolbar-head">
    <ion-buttons slot="start" mode='ios'>
      <ion-back-button text="" defaultHref=""></ion-back-button>
    </ion-buttons>
    <ion-title> Payment Methods </ion-title>
  </ion-toolbar>
</ion-header>
<ion-content>
  <ion-item lines='full' class="list-item"  *ngFor="let item of cardList" (click)="onClickItem(item)">

    <label style="color: #9e9e9e;">PAYMENT</label>
    <img class="pay-item-icon" style="width: 3rem; height: auto;    border-right: 1px solid #d6d6d6;border-radius: 0;" src="../../../../assets/img/wankaifu1.png" alt="">
    

    <ion-label>{{utilsCard(item.cardNo)}}</ion-label>
    <label lines='full'></label>
    <!-- <img src="../../../../assets/img/add-icon.png" alt=""> -->
    <span (click)="del(item)">Delete</span>
  </ion-item>

  <div class="item-add" [routerLink]="['/payment-add-card']" routerLinkActive="router-link-active" >
  <!-- <div class="item-add" *ngIf="this.cardType=='1'" (click)="onClickUrl()"> -->
      <img src="../../../../assets/img/add-icon.png" alt="">
      <ion-label>Add a Mastercard</ion-label>
  </div>

  <span style="    position: fixed;
  bottom: 0;
  width: 100%;
  background: #fff;
  font-size: 1rem;
  padding: 0 5px;">Note: We only accept Mastercard now, sorry for the inconvenience</span>
</ion-content>